Skip to content

Add multiactions in the contact list#4477

Merged
GVodyanov merged 1 commit into
mainfrom
feat/multi-actions-in-contacts-list
Jul 3, 2025
Merged

Add multiactions in the contact list#4477
GVodyanov merged 1 commit into
mainfrom
feat/multi-actions-in-contacts-list

Conversation

@GVodyanov

@GVodyanov GVodyanov commented May 26, 2025

Copy link
Copy Markdown
Contributor

Fix #4392
Fix #277

image
image

How to interact:

  • Regular avatar click: select one at a time
  • Shift click on body: select one at a time and range selection
  • Shift click on avatar: only range selection

Range selection works by clicking on two extremes and everything in the middle will be selected, exactly like in mail.

There is also a small dialogue when deleting contacts.

@GVodyanov GVodyanov self-assigned this May 26, 2025
@GVodyanov GVodyanov added the 2. developing Work in progress label May 26, 2025
@codecov

codecov Bot commented May 26, 2025

Copy link
Copy Markdown

Codecov Report

Attention: Patch coverage is 0% with 50 lines in your changes missing coverage. Please review.

Project coverage is 10.80%. Comparing base (d0f63c0) to head (d414170).

Files with missing lines Patch % Lines
src/components/ContactsList.vue 0.00% 39 Missing ⚠️
src/components/ContactsList/ContactsListItem.vue 0.00% 11 Missing ⚠️
Additional details and impacted files
@@             Coverage Diff              @@
##               main    #4477      +/-   ##
============================================
- Coverage     11.00%   10.80%   -0.20%     
  Complexity      265      265              
============================================
  Files           122      122              
  Lines          5608     5708     +100     
  Branches       1215     1246      +31     
============================================
  Hits            617      617              
- Misses         4869     4969     +100     
  Partials        122      122              

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@GVodyanov GVodyanov force-pushed the feat/multi-actions-in-contacts-list branch from 19df18e to 6804b5e Compare June 8, 2025 16:44
@GVodyanov GVodyanov added enhancement New feature or request 3. to review Waiting for reviews and removed 2. developing Work in progress labels Jun 8, 2025
@GVodyanov GVodyanov marked this pull request as ready for review June 8, 2025 16:45
@GVodyanov GVodyanov requested a review from hamza221 as a code owner June 8, 2025 16:45
@GVodyanov GVodyanov requested review from GretaD and st3iny June 8, 2025 16:45

@hamza221 hamza221 left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Comment thread src/components/ContactsList.vue Outdated
Comment thread src/components/ContactsList.vue Outdated
Comment thread src/components/ContactsList/ContactsListItem.vue
@GVodyanov

Copy link
Copy Markdown
Contributor Author

I found this bug
clicking on the icon clicking on the components
https://github.com/user-attachments/assets/653755d1-ee75-4395-aac6-5f73c2b9375a https://github.com/user-attachments/assets/17c95786-5a70-4258-ab41-9460687ad746

Hey! are you sure that's the right video @hamza221 😅?

Either way, yes clicking on the avatar has a different action, like in mail. Is it not working intuitively?

@hamza221

hamza221 commented Jun 12, 2025

Copy link
Copy Markdown
Contributor

Hey! are you sure that's the right video @hamza221 😅?

Mb I uploaded the wrong video, please have another look I updated it

@hamza221

hamza221 commented Jun 12, 2025

Copy link
Copy Markdown
Contributor

Either way, yes clicking on the avatar has a different action, like in mail. Is it not working intuitively?

IMO selection should either work the same way when clicking on the component and Avatar, or not work at all when clicking the component.
Also Shift+ click is usually inclusive of the last element pressed.

@GVodyanov

GVodyanov commented Jun 13, 2025

Copy link
Copy Markdown
Contributor Author

Notes from meeting:

  • Only show actions if at least one contact supports that action

Advice from Nimisha:

  • Make the check a little smaller
  • Add a short animation when showing the actions

EDIT: done

@GVodyanov

Copy link
Copy Markdown
Contributor Author

image

@nimishavijay Here's the checkboxes becoming a little smaller, delete being grayed out because it can't be applied, and on hover it says "Please select at least one editable contact to delete".

I also added the same animation as in mail but quicker.

@hamza221 hamza221 left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The above mentioned bug is still unresolved
https://github.com/user-attachments/assets/b2e6a3e9-fc45-4c9e-93f3-45d9058986fc

Edit: Mail app for comparison

Screen.Recording.2025-06-20.at.18.22.19.mov

@nimishavijay nimishavijay left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice! Looks great with the smaller checkmarks now.

Only change would be in the confirmation dialog. We can use an NcNoteCard component in the warning style to show the read only warning, that should make it more eye-catching :)

@GVodyanov GVodyanov force-pushed the feat/multi-actions-in-contacts-list branch from 6b8e429 to d414170 Compare June 22, 2025 18:22
@GVodyanov

Copy link
Copy Markdown
Contributor Author

The above mentioned bug is still unresolved https://github.com/user-attachments/assets/b2e6a3e9-fc45-4c9e-93f3-45d9058986fc

Edit: Mail app for comparison
Screen.Recording.2025-06-20.at.18.22.19.mov

Ahn I see, fixed now, thanks!

@GVodyanov

Copy link
Copy Markdown
Contributor Author

Nice! Looks great with the smaller checkmarks now.

Only change would be in the confirmation dialog. We can use an NcNoteCard component in the warning style to show the read only warning, that should make it more eye-catching :)

Good idea!

Here's how I made it look now
image

@hamza221 hamza221 left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Tested and LGTM 🚀

Comment thread src/components/ContactsList.vue Outdated
Signed-off-by: Grigory Vodyanov <scratchx@gmx.com>
@GVodyanov GVodyanov force-pushed the feat/multi-actions-in-contacts-list branch from d414170 to e1639fd Compare July 3, 2025 18:34
@GVodyanov GVodyanov merged commit f9bfbe2 into main Jul 3, 2025
40 checks passed
@GVodyanov GVodyanov deleted the feat/multi-actions-in-contacts-list branch July 3, 2025 18:36
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

3. to review Waiting for reviews enhancement New feature or request

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Bulk actions on contacts Select multiple contacts and have batch-actions on the selection

3 participants